<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../css/index.css">
    <link rel="stylesheet" href="../css/page.css">
</head>
<body>
<div class="peo_admin_header">
    <div class="peo_title">七星农场科研管理平台</div>
    <div class="peo_tab ">
        <span>
           科研课题列表
        </span>
        <span class="active">
           科研人员列表
        </span>
    </div>
    <div></div>
</div>
<div class="peo_content">
    <div class="nav">
      <span class="nav_left">科研人员列表</span><span>  /  科研人员列表  /  人员管理</span>
    </div>
    <div class="peo_con">
        <div class="peo_search">
            <span>课题名称</span>
            <input placeholder="请输入名称">
            <span>课题来源</span>
            <select>
                <option style="display: none;" disabled selected>请选择</option>
            </select>
            <span>课题分类</span>
            <select>
                <option style="display: none;" disabled selected>请选择</option>
            </select>
            <span>课题状态</span>
            <select>
                <option style="display: none;" disabled selected>请选择</option>
            </select>
            <span class="peo_search_btn">查询</span>
        </div>
        <div class="peo_table">
            <table cellspacing="0" cellpadding="0">
                <thead>
                <tr>
                    <td>创建时间</td>
                    <td>课程来源</td>
                    <td>课题名称</td>
                    <td>课题分类</td>
                    <td>承接人</td>
                    <td>状态</td>
                    <td>操作</td>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>2019-05-05</td>
                    <td>总局</td>
                    <td>不同粉碎方式对水稻桔柑腐解效果的影响</td>
                    <td>栽培</td>
                    <td>马宁</td>
                    <td>已下发</td>
                    <td>
                        <span>查看详情</span>
                    </td>
                </tr>
                <tr>
                    <td>2019-05-05</td>
                    <td>总局</td>
                    <td>不同粉碎方式对水稻桔柑腐解效果的影响</td>
                    <td>栽培</td>
                    <td>马宁</td>
                    <td>已下发</td>
                    <td>
                        <span>查看详情</span>
                    </td>
                </tr>
                <tr>
                    <td>2019-05-05</td>
                    <td>总局</td>
                    <td>不同粉碎方式对水稻桔柑腐解效果的影响</td>
                    <td>栽培</td>
                    <td>马宁</td>
                    <td>已下发</td>
                    <td>
                        <span>查看详情</span>
                    </td>
                </tr>
                <tr>
                    <td>2019-05-05</td>
                    <td>总局</td>
                    <td>不同粉碎方式对水稻桔柑腐解效果的影响</td>
                    <td>栽培</td>
                    <td>马宁</td>
                    <td>已下发</td>
                    <td>
                        <span>查看详情</span>
                    </td>
                </tr>
                <tr>
                    <td>2019-05-05</td>
                    <td>总局</td>
                    <td>不同粉碎方式对水稻桔柑腐解效果的影响</td>
                    <td>栽培</td>
                    <td>马宁</td>
                    <td>已下发</td>
                    <td>
                        <span>查看详情</span>
                    </td>
                </tr>
                <tr>
                    <td>2019-05-05</td>
                    <td>总局</td>
                    <td>不同粉碎方式对水稻桔柑腐解效果的影响</td>
                    <td>栽培</td>
                    <td>马宁</td>
                    <td>已下发</td>
                    <td>
                        <span>查看详情</span>
                    </td>
                </tr>
                <tr>
                    <td>2019-05-05</td>
                    <td>总局</td>
                    <td>不同粉碎方式对水稻桔柑腐解效果的影响</td>
                    <td>栽培</td>
                    <td>马宁</td>
                    <td>已下发</td>
                    <td>
                        <span>查看详情</span>
                    </td>
                </tr>
                <tr>
                    <td>2019-05-05</td>
                    <td>总局</td>
                    <td>不同粉碎方式对水稻桔柑腐解效果的影响</td>
                    <td>栽培</td>
                    <td>马宁</td>
                    <td>已下发</td>
                    <td>
                        <span>查看详情</span>
                    </td>
                </tr>
                <tr>
                    <td>2019-05-05</td>
                    <td>总局</td>
                    <td>不同粉碎方式对水稻桔柑腐解效果的影响</td>
                    <td>栽培</td>
                    <td>马宁</td>
                    <td>已下发</td>
                    <td>
                        <span>查看详情</span>
                    </td>
                </tr>
                <tr>
                    <td>2019-05-05</td>
                    <td>总局</td>
                    <td>不同粉碎方式对水稻桔柑腐解效果的影响</td>
                    <td>栽培</td>
                    <td>马宁</td>
                    <td>已下发</td>
                    <td>
                        <span>查看详情</span>
                    </td>
                </tr>
                </tbody>
            </table>
            <div id="pagination" class="pagination"></div>
        </div>
    </div>

</div>
</body>
<script src="../js/page.js"></script>
<script src="../js/jq.1.9.1.min.js"></script>
<script>
    $(function () {       //点击切换
        $('.peo_tab span').click(function () {
            $('.peo_tab span').removeClass('active')
            $(this).addClass('active')
        })
    })
    
    //分页
    window.onload = function () {
        new Page({
            id: 'pagination',
            pageTotal: 50, //必填,总页数
            pageAmount: 10,  //每页多少
            dataTotal: 500, //总共多少条数据
            curPage:1, //初始页码,不填默认为1
            pageSize: 5, //分页个数,不填默认为5
            showPageTotalFlag:true, //是否显示数据统计,不填默认不显示
            showSkipInputFlag:true, //是否支持跳转,不填默认不显示
            getPage: function (page) {
                //获取当前页数
                console.log(page);
            }
        })
    }
</script>
</html>